<template>
  <div>
    <div>
      <el-form :model="searchList" ref="searchList" size="normal">
        <el-row :gutter="20">
          <el-col :span="12" :offset="0">
            <el-form-item label="">
              <el-input v-model="searchList.project_name" placeholder="项目名称" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span='12' :offset='0'>
            <div class="right">
              <el-button type="primary" size="medium" @click="search" :loading="loading">查询</el-button>
              <el-button type="primary" size="medium" @click="handleExpand" :loading="loading">
                <i :class="isExpand?'el-icon-remove-outline':'el-icon-circle-plus-outline'"></i>
                {{isExpand?'关闭全部行':'展开全部行'}}
              </el-button>
            </div>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <el-table :data='tableData' border stripe :height='offsetHeight' v-loading='loading' ref='table' row-key="id"
      :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
      <el-table-column label='名称' min-width='80' align='left' header-align="center" tree>
        <template slot-scope='{row}'>
          {{row.name}}
        </template>
      </el-table-column>
      <el-table-column label='金额' align='center' width="150">
        <template slot-scope='{row}'>
          <span v-if="row.grade =='1'">{{row.pr_service_amount ? row.pr_service_amount.toFixed(4):'0' }}</span>
          <span v-else-if="row.grade =='2'">{{row.pa_service_amount ? row.pa_service_amount.toFixed(4):'0' }}</span>
          <span v-else-if="row.grade =='3'">{{row.su_service_amount ? row.su_service_amount.toFixed(4):'0' }}</span>
        </template>
      </el-table-column>
      <el-table-column label='操作' width='400' align='center'>
        <template slot-scope='{row}'>
          <template v-if="row.grade=='1'">
            <el-button-group>
              <el-button type="green" size="mini" @click="details(row)">项目信息</el-button>
              <el-button type="success" size="mini" @click="submit(row.id)" :loading="saveLoading">上报
              </el-button>
            </el-button-group>
          </template>
          <template v-else-if="row.grade=='3'">
            <el-button-group>
              <el-button type="primary" size="mini" @click="editTarget(row)">查看</el-button>
              <el-button type="green" size="mini" @click="editIt(row)">查看IT资产及服务</el-button>
              <el-button type="warning" size="mini" @click="addTargetVar(row.id)">招标技术参数</el-button>
            </el-button-group>
          </template>
        </template>
      </el-table-column>
    </el-table>
    <!-- 标的信息 -->
    <el-dialog title="标的信息" :visible.sync="targetShow" width="50%" @close="cancel" :destroy-on-close="true">
      <target-item ref="target" @cancel="cancel" @init="init" :form-list="targetParams" :switch="this.switch">
      </target-item>
    </el-dialog>
    <!-- 招标技术参数信息 -->
    <el-drawer title="招标技术参数" :visible.sync="targetVarShow" size="70%" :destroy-on-close="true"
      :wrapperClosable="false">
      <target-var-item ref="targetVar" @cancel="cancel" @init="init" :targetVarParams="targetVarParams"
        :switch="this.switch">
      </target-var-item>
    </el-drawer>
    <!-- 项目表单信息 -->
    <el-dialog title="总体审核信息" :visible.sync="projectListShow" width="80%" @close="cancel" :destroy-on-close="true"
      top="0">
      <project-list-item ref="projectList" @cancel="cancel" @init="init" :form-list="projectListParams" :switch="true">
      </project-list-item>
    </el-dialog>

  </div>
</template>

<script>
import ProjectListItem from '@/components/Bid/ProjectList.vue'
import TargetItem from '@/components/Bid/Target.vue'
import TargetVarItem from '@/components/Bid/TargetVar.vue'
export default {
  name: 'BidEnsureNoFinish',
  components: {
    ProjectListItem, TargetItem, TargetVarItem
  },
  props: {
    switch: {
      type: Boolean,
      default: () => {
        return false
      }
    }
  },
  data () {
    return {
      offsetHeight: document.documentElement.clientHeight - 260,
      loading: false,
      saveLoading: false,
      searchList: {},
      tableData: [],
      isExpand: false,
      targetShow: false,
      targetParams: {},
      targetVarShow: false,
      targetVarParams: {},
      projectListShow: false,
      projectListParams: {},
    }
  },
  created () {
  },
  mounted () {
    this.init()
  },
  methods: {
    async init () {
      this.loading = true
      const res = await this.$http('blockList', {
        del_flag: '0',
        status: '4',
        source: '2',
        ...this.searchList
      })
      this.tableData = res
      this.loading = false
    },
    search () {
      this.init()
    },
    addProject () {
      this.projectParams = {
        status: '51',
        source: '1'
      }
      this.projectShow = true
    },
    details (item) {
      this.projectListParams = {
        id: item.id,
        type: 'third'
      }
      this.projectListShow = true
    },
    async submit (id) {
      this.$confirm('是否同意上报', '提示', {
        message: '请检查是否填写报告内的全部审核信息，并导出报告来核对。',
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(async action => {
        const res = await this.$http('blockthirdUp', {
          del_flag: '0',
          id: id,
          status: '4',
          target_status: '52',
          check_status: '1',
          third_check_advice: '通过'
        })
        this.$tips.success(res.errmsg)
        this.init()
      }).catch(() => {

      });
    },
    addTarget (item) {
      this.targetParams = {
        project_name: item.project_name,
        package_name: item.name,
        package_id: item.id,
      }
      this.targetShow = true
    },
    editTarget (item) {
      this.targetParams = {
        project_name: item.project_name,
        package_name: item.name,
        id: item.id,
        target_name: item.name,
        serve_time: item.serve_time,
        type: JSON.parse(item.type),
        type_other: item.type_other,
        sort: item.sort,
      }
      this.targetShow = true
    },
    addTargetVar (id) {
      this.targetVarParams = {
        id: id,
      }
      this.targetVarShow = true
    },
    editIt (item) {
      sessionStorage.setItem("bidInfo",
        JSON.stringify({
          id: item.id,
          source: '2',
          titleName: item.name + '——' + item.package_name + '——' + item.project_name,
          root: 'noFinish'
        })
      );
      this.$emit('toIt', this.switch, 'noFinish');
    },
    cancel () {
      this.targetShow = false
      this.targetParams = {}
      this.targetVarShow = false
      this.targetVarParams = {}
      this.projectListParams = {}
      this.projectListShow = false
    },
    // 是否展开table(展开与折叠切换)
    handleExpand () {
      this.isExpand = !this.isExpand
      this.$nextTick(() => {
        this.forArr(this.tableData, this.isExpand)
      })
    },
    // 遍历
    forArr (arr, isExpand) {
      arr.forEach(i => {
        // toggleRowExpansion(i, isExpand)用于多选表格，切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中）
        this.$refs.table.toggleRowExpansion(i, isExpand)
        if (i.children) {
          this.forArr(i.children, isExpand)
        }
      })
    },
  },
  computed: {

  },
}
</script>
<style lang='scss' scoped>
</style>